import 'package:environmental_les_app/common/routes/route_names.dart';
import 'package:environmental_les_app/common/style/colours.dart';
import 'package:environmental_les_app/common/widgets/exit_widget.dart';
import 'package:flutter_clx_base/flutter_clx_base.dart';

import 'index.dart';

class MainPage extends GetView<MainController> {
  const MainPage({super.key});

  @override
  Widget build(BuildContext context) {
    return ExitWidget(
      child: GetBuilder<MainController>(
        init: MainController(),
        id: "main",
        builder: (_) {
          return Scaffold(
            backgroundColor: Colours.bgColor,
            // 浮动操作按钮
            floatingActionButton: FloatingActionButton(
              onPressed: () {
                // 添加巡查按钮的点击逻辑
                Get.toNamed(AppRoutes.patrolPage);
              },
              backgroundColor: Colours.appMain,
              shape: const CircleBorder(),
              child: const Icon(
                Icons.add,
                color: Colors.white,
                size: 35,
              ),
            ),
            // 浮动按钮的位置
            floatingActionButtonLocation:
                FloatingActionButtonLocation.centerDocked,
            bottomNavigationBar: _buildBottomBar(),
            body: IndexedStack(
              index: controller.homePosition,
              children: controller.pageList,
            ),
          );
        },
      ),
    );
  }

  Widget _buildBottomBar() {
    return BottomAppBar(
      shape: const CircularNotchedRectangle(), // 底部导航栏形状
      height: 70,
      padding: const EdgeInsets.symmetric(horizontal: 0, vertical: 5),
      color: Colors.white,
      elevation: 0,
      child: Row(
        // 主轴对齐方式，spaceAround 会在项目之间均匀分配空间
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: <Widget>[
          _buildNavItem(Icons.home, '首页', 0),
          _buildNavItem(Icons.search, '查询', 1),
          // 中间为浮动按钮留出空间
          const Padding(
            padding: EdgeInsets.symmetric(vertical: 4.0, horizontal: 4.0),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                // 添加一个透明的图标，以保证文字与其他项的文字垂直对齐
                Icon(Icons.add, color: Colors.transparent),
                SizedBox(height: 4),
                Text(
                  '巡查',
                  style: TextStyle(color: Colours.iconGray),
                ),
              ],
            ),
          ),
          _buildNavItem(Icons.bar_chart, '统计', 2),
          _buildNavItem(Icons.person, '我的', 3),
        ],
      ),
    );
  }

  // 构建单个导航项的辅助方法
  Widget _buildNavItem(IconData icon, String label, int index) {
    // 判断当前项是否为选中项
    final isSelected = controller.homePosition == index;
    // 根据是否选中来决定颜色
    final color = isSelected ? Colours.appMain : Colours.iconGray;

    return InkWell(
      onTap: () => controller.onTap(index),
      borderRadius: BorderRadius.circular(20.0), // 添加点击效果的圆角
      child: Padding(
        padding: const EdgeInsets.symmetric(vertical: 4.0, horizontal: 4.0),
        child: Column(
          mainAxisSize: MainAxisSize.min, // 让 Column 包裹内容
          children: <Widget>[
            Icon(icon, color: color),
            const SizedBox(height: 2),
            Text(
              label,
              style: TextStyle(color: color, fontSize: 13),
            ),
          ],
        ),
      ),
    );
  }
}
